/*
 * @Author       : NaN 353362604@qq.com
 * @Date         : 2023-06-25 10:10:03
 * @LastEditTime : 2023-08-09 09:18:41
 * @LastEditors  : NaN 353362604@qq.com
 * @FilePath     : \AdminStration\src\Common\Login\LoginStyle\jtgj.jsx
 * @Description  :
 */
import '../Scss/jtgj.scss'
import { lazy, Suspense, useState } from 'react'
import { PlugInUnit } from '../PlugInUnit'

import { ModalBox } from '../../Modal/ModalBox'
import { WebCommonUrl } from '../../Configure/CommonParameter'

const SignUp = lazy(() => import('../SignUp'))

const JtgjPage = ({ imageUrl, title }) => {
    const [OptionsCall, setOptionsCall] = useState()

    const onScanCode = () => {
        setOptionsCall({
            type: 'ScanCodeModel',
            data: { title: '扫码登录', width: 400 },
        })
    }

    const backImageList = [
        `${imageUrl}BackA01.png`,
        `${imageUrl}BackA02.jpg`,
        `${imageUrl}BackA03.jpg`,
        `${imageUrl}BackA04.jpg`,
        `${imageUrl}BackA05.jpg`,
        `${imageUrl}BackA06.jpg`,
    ]
    return (
        <Suspense fallback={<div>jjt</div>}>
            <div className="jtgj">
                <div className="Back" style={{ '--num': backImageList.length, '--spen': 3.5 }}>
                    {backImageList.map((url, index) => (
                        <img className={`img${index}`} key={index} src={url} alt="" />
                    ))}
                </div>
                <div className="Title">
                    <img src={imageUrl + 'Logo.png'} alt="" />
                    <div>{title}</div>
                </div>

                <div className="Login">
                    <img src={imageUrl + 'LoginSign.png'} alt="" />
                    <div className="sign">
                        <div className="Title">
                            <div>平台登录</div>
                            <div>多平台账号互通，更加便捷、方便。</div>
                        </div>
                        <SignUp />
                        <PlugInUnit />
                    </div>
                </div>
                <img className="ScanWeChat" onClick={onScanCode} src={WebCommonUrl + 'ScanWeChat.png'} alt="" />
                <div className="tips">严肃法纪，严厉打击泄露国家秘密的违法行为！</div>
            </div>
            <ModalBox OptionsCall={OptionsCall} />
        </Suspense>
    )
}

export default JtgjPage
